<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>陌陌酒店平台</title>
    <!-- Stylesheets -->
    <link href="static/css/bootstrap.css" rel="stylesheet">
    <link href="static/css/revolution-slider.css" rel="stylesheet">
    <link href="static/css/style.css" rel="stylesheet">

    <!--Favicon-->
    <link rel="shortcut icon" href="static/images/favicon.ico" type="image/x-icon">
    <link rel="icon" href="static/images/favicon.ico" type="image/x-icon">

    <!-- Responsive -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link href="static/css/responsive.css" rel="stylesheet">
    <script type="text/javascript" src="static/jquery/jquery-2.1.1.min.js"></script>
</head>


<body>
<div class="page-wrapper">

    <header class="header" id="header"></header>
    <script type="text/javascript">
        /*引入Header部分公共代码*/
        $(function () {
            $.ajax({
                type: "get",
                url: "header.html",
                async: true,
                success: function (data) {
                    $("#header").html(data);
                }
            });
        });
    </script>


    <!-- main header area end -->

    <!--Page Title-->
    <section class="page-title text-center">
        <div class="auto-container">
            <div class="content-box">
                <div class="title">新闻详情</div>
                <ul class="bread-crumb">
                    <li><a href="index.html">主页<i class="fa fa-angle-right"></i></a></li>
                    <li>新闻详情</li>
                </ul>
            </div>
        </div>
    </section>
    <!--End Page Title-->

    <!-- News Details -->
    <section class="sidebar-page-container news-details news-section latest-news">
        <div class="container">
            <div class="row">
                <div class="content-side col-md-8 col-sm-8 col-xs-12">
                    <div class="blog-single-section">
                        <div id="news" class="single-item">
                            <!-- 新闻详细 -->
                        </div>
                        <div class="post-share-option">
                            <div class="text">标签:酒店，度假村，水疗中心</div>
                            <ul class="post-social">
                                <li>分享:</li>
                                <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                <li><a href="#"><i class="fa fa-pinterest-p"></i></a></li>
                                <li><a href="#"><i class="fa fa-vimeo"></i></a></li>
                            </ul>
                        </div>
                        <div id="selectComment" class="comment-area">
                            <div class="comment-title"><h3 id="count"></h3></div>
                            <!-- 评论 -->
                        </div>
                        <div class="comment-form">
                            <div class="comment-title"><h3>发表评论</h3></div>
                            <form id="contact-form" name="contact_form" class="default-form">
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 col-xs-12">
                                        <textarea placeholder="你的评论" id="comment_content" name="comment_content"
                                                  required=""></textarea>
                                    </div>
                                </div>
                                <button type="button" id="addComment" class="btn-one"
                                        data-loading-text="Please wait...">提交
                                </button>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="sidebar-side col-md-4 col-sm-6 col-xs-12">
                    <div class="sidebar">
                        <div class="sidebar-widget search-box">
                            <div class="form-group">
                                <form method="post" action="index.html">
                                    <input type="search" name="search" placeholder="搜索..." required>
                                    <button type="submit"><i class="fa fa-search"></i></button>
                                </form>
                            </div>
                        </div>
                        <div class="sidebar-widget sidebar-blog-category">
                            <div class="sidebar-title">
                                <h3>类别</h3>
                            </div>
                            <ul class="blog-cat">
                                <li><a href="#">豪华客房</a></li>
                                <li><a href="#">洗衣室</a></li>
                                <li><a href="#">健身房</a></li>
                                <li><a href="#">悠闲娱乐</a></li>
                                <li><a href="#">安排住宿</a></li>
                            </ul>
                        </div>
                        <div id="hotNews" class="sidebar-widget posts-widget">
                            <div class="sidebar-title">
                                <h3>最新文章</h3>
                            </div>

                            <!-- 最新新闻 -->
                        </div>
                        <div class="sidebar-widget sidebar-tag">
                            <div class="sidebar-title">
                                <h3>人气标签</h3>
                            </div>
                            <ul class="blog-cat">
                                <li><a href="#">旅馆</a></li>
                                <li><a href="#">客房</a></li>
                                <li><a href="#">餐饮</a></li>
                                <li><a href="#">活动</a></li>
                                <li><a href="#">运动</a></li>
                                <li><a href="#">常去胜地</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- News Details end -->


    <!--页眉-->
    <div class="footer" id="footer"></div>
    <script type="text/javascript">
        /*引入Header部分公共代码*/
        $(function () {
            $.ajax({
                type: "get",
                url: "footer.html",
                async: true,
                success: function (data) {
                    $("#footer").html(data);
                }
            });
        });
    </script>
    <script>
        <!--查询单个新闻详细信息-->
        $(function () {
            $.ajax({
                //提交数据的类型 POST GET
                type: "POST",
                //提交的网址
                url: "newsDetail1",
                dataType: "json",
                //成功返回之后调用的函数
                contentType: "application/json",
                success: function (returnData) {
                    //获取数据库日期
                    var now = new Date(returnData.time);
                    //获取日期年份
                    var year = now.getFullYear();
                    //获取日期月份
                    var month = (now.getMonth() + 1).toString();
                    //获取日期天数
                    var day = (now.getDate()).toString();
                    $("#news").append("\n" +
                        "                            <div class=\"news-content\">\n" +
                        "                                <div class=\"date\">" + day + "<span>" + month + "月</span></div>\n" +
                        "                                <h3 id=\"title\">" + returnData.titel + "</h3>\n" +
                        "                                <ul class=\"list\">\n" +
                        "                                    <li><i class=\"fa fa-user\" aria-hidden=\"true\"></i>"+returnData.username+"</li>\n" +
                        "                                    <!--ajax-->\n" +
                        "                                    <li><i class=\"fa fa-heart-o\" aria-hidden=\"true\"></i>350</li>\n" +
                        "                                    <li><i class=\"fa fa-comments-o\" aria-hidden=\"true\"></i>30</li>\n" +
                        "                                </ul>\n" +
                        "                            </div>\n" +
                        "                            <p id=\"content\">" + returnData.content + "</p>\n" +
                        "                        ")
                },
                //调用出错执行的函数
                error: function (responseText) {
                    //请求出错处理
                    console.error(responseText);
                }
            });
        })
    </script>
    <script>
        <!-- 查询所有最新新闻 -->
        $(function () {
            $.ajax({
                //提交数据的类型 POST GET
                type: "POST",
                //提交的网址
                url: "selectNews",
                dataType: "json",
                async: true,
                //成功返回之后调用的函数
                contentType: "application/json",
                success: function (returnData) {
                    console.log(returnData);
                    $.each(returnData, function (i, value) {
                        //获取数据库日期
                        var now = new Date(value.time);
                        //获取日期年份
                        var year = now.getFullYear();
                        //获取日期月份
                        var month = (now.getMonth() + 1).toString();
                        //获取日期天数
                        var day = (now.getDate()).toString()
                        $("#hotNews").append("<div class=\"single-item\">\n" +
                            "                                <div class=\"img-box\">\n" +
                            "                                    <figure><img src=\"upload/"+value.pic+"\" alt=\"\"></figure>\n" +
                            "                                </div>\n" +
                            "                                <a href=\"newsDetail?id=" + value.id + "\"><h5>" + value.titel + "</h5></a>\n" +
                            "                                <div class=\"post-info\"><span class=\"fa fa-calendar\"></span>" + year + '年' + month + '月' + day + '日' + "</div>\n" +
                            "                            </div>")
                    });
                },
                //调用出错执行的函数
                error: function (responseText) {
                    //请求出错处理
                    console.error(responseText);
                }
            });
        })
    </script>
    <script>
        <!-- 获取评论 -->
        $(function () {
            $.ajax({
                //提交数据的类型 POST GET
                type: "POST",
                //提交的网址
                url: "selectComment",
                dataType: "json",
                //成功返回之后调用的函数
                contentType: "application/json",
                success: function (returnData) {
                    $("#count").html("评论" + "(" + returnData.length + ")")
                    $.each(returnData, function (i, value) {
                        //获取数据库日期
                        var now = new Date(value.commentTime);
                        //获取日期年份
                        var year = now.getFullYear();
                        //获取日期月份
                        var month = (now.getMonth() + 1).toString();
                        //获取日期天数
                        var day = (now.getDate()).toString()
                        $("#selectComment").append("<div class=\"comment-box\">\n" +
                            "                                <figure><img style='height: 100px;width: 100px' src=\"static/upload/"+value.photo+"\"></figure>\n" +
                            "                                <div class=\"comment-inner\">\n" +
                            "                                    <div class=\"comment-name\" id=\"comment-name\">"+value.username+"</div>\n" +
                            "                                    <div class=\"comment-info\" id=\"comment-info\"><i class=\"fa fa-calendar\"></i>" + year + '年' + month + '月' + day + '日' + "</div>\n" +
                            "                                    <p id=\"remark\">" + value.commentContent + "</p>\n" +
                            "                                </div>\n" +
                            "                            </div><br><br><br>")
                    });
                },
                //调用出错执行的函数
                error: function (responseText) {
                    //请求出错处理
                    console.error(responseText);
                }
            });
        })
    </script>
    <script>
        <!-- 添加评论 -->
        $("#addComment").bind("click", function () {
            $.ajax({
                //提交数据的类型 POST GET
                type: "POST",
                //提交的网址
                url: "addComment",
                data: {
                    "comment_content": $("#comment_content").val()
                },
                success: function (returnData) {
                    alert(returnData);
                    if (returnData == ("请登录")) {
                        window.location.href = "login1.html";
                    } else if (returnData == ("评论内容不能为空") || returnData == ("评论失败")) {
                    } else if (returnData == ("评论成功")) {
                        window.location.href = "news-detail.html";
                    }
                },
                //调用出错执行的函数
                error: function (responseText) {
                    //请求出错处理
                    console.error(responseText);
                }
            });
        });
    </script>

</div>
<!--End pagewrapper-->


<!--Scroll to top-->
<div class="scroll-to-top scroll-to-target" data-target=".main-header"><span class="icon fa fa-angle-up"></span></div>


<!-- jQuery js -->

<script src="static/js/map-script.js"></script>
<script type="text/javascript" src="static/js/jquery-2.1.4.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/jquery.themepunch.tools.min.js"></script>
<script src="static/js/jquery.themepunch.revolution.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.navigation.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.parallax.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.migration.min.js"></script>
<script type="text/javascript" src="static/js/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="static/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="static/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="static/js/jquery.appear.js"></script>
<script type="text/javascript" src="static/js/jquery.countTo.js"></script>
<script src="static/js/isotope.js"></script>
<script src="static/js/jquery.fancybox.pack.js"></script>
<script src="static/js/jquery.fancybox-media.js"></script>
<script src="static/js/owl.js"></script>
<script src="static/js/masterslider.js"></script>
<script type="text/javascript" src="static/js/jquery.polyglot.language.switcher.js"></script>
<script src="static/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="static/js/jquery.mixitup.min.js"></script>
<script src="static/js/validate.js"></script>
<script src="static/js/wow.js"></script>
<script src="static/js/script.js"></script>
<script type="text/javascript" src="static/js/theme.js"></script>

<script src="static/js/timePicker.js"></script>
<script src="static/js/jquery-ui.js"></script>

<script src="static/js/validation.js"></script>


<!-- End of .page_wrapper -->

</body>
</html>
